<template>
	<!-- #ifndef APP-NVUE -->
	<view class="yb-sticky" :id="customIdSync" :class="customClassSync" :style="rootStyle">
		<slot></slot>
	</view>
	<!-- #endif -->
	<!-- #ifdef APP-NVUE -->
	<header>
		<slot></slot>
	</header>
	<!-- #endif -->
</template>

<script>
	import Util from '../../js_sdk/util.js'
	import ComponentMixin from '../../js_sdk/componentMixin.js'
	export default {
		mixins: [ComponentMixin],
		props: {
			top: {
				type: [Number, String],
				default: 0
			}
		},
		computed: {
			Util () {
				return Util
			},
			rootStyle () {
				// #ifndef APP-NVUE
				return this.filterStyle({
					top: Util.pixelunit(this.top)
				}) + this.customStyleSync
				// #endif
				// #ifdef APP-NVUE
				return this.customStyleSync
				// #endif
			}
		}
	}
</script>

<style scoped>
	.yb-sticky {
		position: sticky;
		z-index: 1;
	}
</style>